/**index.wxss**/
page {
  // height: 100vh;
  display: flex;
  flex-direction: column;
  background-color: #fff;
  padding:16rpx;
  box-sizing: border-box;
  >view{
    &:nth-child(n+2){
      margin-top:16rpx;
    }
  }
}

.scrollarea {
  flex: 1;
  overflow-y: hidden;
}

// 轮播图样式
.swiper {
  swiper {
    height: 360rpx;
    background-color: skyblue;
    border-radius:100rpx;

    swiper-item {
      image {
        width: 100%;
        height: 100%;
        border-radius:10rpx;
        overflow: hidden;
      }

      &:first-child {
        background-color: lightsalmon;
      }

      &:last-child {
        background-color: lightseagreen;
      }
    }
  }
}

.info {
  display: flex;
  justify-content: space-between;
  border-radius:10rpx;
  padding: 20rpx 16rpx;
  background-color: #fff;
  
  font-size:24rpx;
  .iconfont{
    font-size:24rpx;
    margin-right:10rpx;
  }

}
.good-nav{
  display: flex;
  
  justify-content: space-between;
  background-color: #fff;
  padding:20rpx 16rpx;
  border-radius:10rpx;
  view{
    navigator{
      display: flex;
      flex-direction: column;
      align-items:center;

    }
 

    image{
      width:80rpx;
      height:80rpx;
    }
    text{
      font-size:24rpx;
      margin-top:12rpx;
    }
  }
}
.good-hot{
  background:#fff;
  padding:16rpx;
  border-radius:10rpx;
  font-size:24rpx;
  .scroll-x{
    display:flex;
    width:100%;
    white-space: nowrap;
    flex-wrap: nowrap;
    height:440rpx;
  
    // padding:16px;
    view{
         
      width:320rpx;
      height:440rpx;
      display:inline-block;
      margin-right:16rpx;
      &:last-child{
        margin-right:0;
      }
     
    
      .good-item{
        display: flex;
        flex-direction: column;
        align-items: center;
        text{
          &:first-of-type{
            font-weight:bold;
          }
        }
      
      }
      image{
        width:100%;
        height:320rpx;
      }
    }
    // background-color: skyblue;
    // view{
    //   display: inline-block;
    //   width:300rpx;
    //   height:80rpx;
    //   &:last-child{
    //     background: springgreen;
    //   }
    //   &:first-child{
    //     background: pink;
    //   }
    // }
  }
}